<template>
	<view :class="{ 'm-2': ismy }">
		<view v-if="list.length == 0" style="background-color: #F2F2F2;">
			<view class="p-2 mt-3"><u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty></view>
		</view>
		<view v-else>
			<view
				class="bg-white mb-2 w-100 p-2 flex align-center justify-betwee"
				:class="{ info_warp: ismy }"
				v-for="(item, index) of list"
				:key="item.id"
				@click="goPages('/subPages/company_home/info_detail?id=' + item.id)"
			>
				<!-- 遮罩层 -->
				<!-- <view class="overlay" v-if="item.check"></view> -->
				<view @tap.stop v-if="ismy" class="top_cont">
					<checkbox-group @change="checkChange(item, index)">
						<view><checkbox class="check" :value="item.id" :checked="item.check" color="#CF1526" /></view>
					</checkbox-group>
				</view>
				<!-- 大图  -->
				<view class="w-100">
					<!-- <view class="bg-white" v-if="index == 0">
					<view class="mb-2 h4 lh_48 ">{{ item.title }}</view>
					<image v-if="item.img_paths[0]" :src="item.img_paths[0]" mode="aspectFill" class="big_img"></image>
					<view class="c_9 font_24 mt-2">
						<text v-if="item.source" class="mr-4">{{ item.source }}</text>
						<text>{{ timeDate(item.add_time) }}</text>
					</view>
				</view> -->
					<!-- 三张缩略图 -->
					<view class="w-100" v-if="item.img_paths.length >= 3">
						<view class="mb-2 h4 lh_48 text_hidden2">{{ item.title }}</view>
						<view class="flex justify-between my-2 w-100">
							<image
								class="small_img"
								:class="{ three_img: ismy }"
								:src="imgItem"
								mode="aspectFill"
								v-for="(imgItem, index) of item.img_paths"
								:key="index"
								v-if="index < 3"
							></image>
						</view>
						<view class="c_9 font_24">
							<text v-if="item.source" class="mr-4">{{ item.source }}</text>
							<text>{{ item.add_time }}</text>
							<!-- <text>{{ timeDate(item.add_time) }}</text> -->
						</view>
					</view>
					<!-- 右侧小图 -->
					<view class="flex justify-between align-center" v-else-if="item.img_paths.length < 3 && item.img_paths.length >= 1">
						<view class="cont_text mr-2">
							<view class="mb-2 h4 lh_48 text_hidden2">{{ item.title }}</view>
							<view class="c_9 font_24">
								<text v-if="item.source" class="mr-4">{{ item.source }}</text>
								<text>{{ item.add_time }}</text>
							</view>
						</view>
						<view class="img_box">
							<!-- 'https://images.weserv.nl/?url=' + -->
							<u--image :src="item.img_paths[0]" width="224rpx" height="133rpx" radius="7">
								<u--image width="224rpx" height="133rpx" radius="7" slot="error" :src="'https://images.weserv.nl/?url=' + item.img_paths[0]" mode=""></u--image>
							</u--image>
							<!-- <image :src="item.img_paths[0]" mode="aspectFill" class="small_img ml-2"></image> -->
						</view>
					</view>
					<!-- 没图片 -->
					<view v-else>
						<view class="mb-2 h4 lh_48 text_hidden2">{{ item.title }}</view>
						<view class="c_9 font_24">
							<text v-if="item.source" class="mr-4">{{ item.source }}</text>
							<text>{{ item.add_time }}</text>
						</view>
					</view>
				</view>
				<view class="product_btn" v-if="ismy">
					<text class="text_btn" @click.stop="goPages('/subPages/company_home/info_detail?id=' + item.id)">查看</text>
					<text class="text_btn" @click.stop="goPages('./publish/info_put?id=' + item.id)">编辑</text>
				</view>
			</view>
			<u-loadmore :status="status" color="#E5E5E5" lineColor="#E5E5E5" dashed line />
		</view>
	</view>
</template>

<script>
import { getZhanNews } from '@/api/home/company.js';
import { InfoDel } from '@/api/my/publish.js';
import util from '@/common/js/util.js';
import login from '@/store/modules/login';
export default {
	props: {
		ismy: {
			type: Boolean,
			default: false
		}
	},
	data() {
		return {
			status: 'loadmore',
			page: 1, //页数
			pagesize: 10, //每页显示条数
			suo: true,
			list: [],
			uid: '',
			checkList: []
		};
	},
	computed: {
		timeDate() {
			return function(val) {
				return util.getDateBeforeNow(val);
			};
		}
	},
	onLoad(option) {
		this.uid = option.companyId;
		this.getList(option.companyId);
		// 分享
		wx.showShareMenu({
			withShareTicket: true,
			menus: ['shareAppMessage', 'shareTimeline']
		});
	},
	created() {
		if (this.ismy) {
			this.getList();
		}
	},
	onReachBottom() {
		if (this.suo) {
			//定义个小锁，当没有数据时锁住suo
			this.status = 'loading';
			this.page = ++this.page;
			setTimeout(() => {
				this.getList();
			}, 1000);
		}
	},
	methods: {
		getList(val) {
			let msg = {
				// 从个人中心企业主页查看使用用户id,展商企业进入查看传入企业id
				uid: this.ismy ? uni.getStorageSync('userInfo').userId : val,
				page: this.page, //页数
				pagesize: this.pagesize //每页显示条数
			};
			getZhanNews(msg).then(res => {
				// console.log('动态咨询', res, res.code);
				if (res.code == 0) {
					this.list.push(...res.data);
					if (res.data.length == 0) {
						this.status = 'nomore';
						this.suo = false;
					} else if (res.data.length < 10) {
						this.status = 'nomore';
						this.suo = false;
					} else {
						this.status = 'loadmore';
						this.suo = true;
					}
				} else {
					uni.$u.toast('获取动态失败');
				}
			});
		},
		// 选择
		checkChange(val, idx) {
			this.$set(this.list[idx], 'check', !val.check);
			if (val.check) {
				this.checkList.push(val.id);
			} else {
				let index = this.checkList.map(item => item).indexOf(val.id);
				this.checkList.splice(index, 1);
			}
			this.$emit('delChange', [...new Set(this.checkList)].length);
		},
		// 删除
		checkDel() {
			this.checkList = [...new Set(this.checkList)];
			let msg = {
				token: uni.getStorageSync('userInfo').token || '',
				ids: this.checkList
			};
			InfoDel(msg)
				.then(res => {
					// console.log(res);
					uni.$u.toast(res.msg);
					if (res.code == 0) {
						this.list = [];
						this.page = 1;
						this.getList();
						this.$emit('delAfter');
					}
				})
				.catch(err => {
					console.log('删除失败', err);
				});
		}
	}
};
</script>

<style lang="scss" scoped>
.info_warp {
	position: relative;
	padding-bottom: 70rpx;
	border-radius: 15rpx;
}
.cont_text {
	min-width: calc(100% - 241rpx);
}
.three_img {
	width: 194rpx;
	height: 103rpx;
}
::v-deep ._img {
	width: 194rpx !important;
	height: 103rpx !important;
}
// .overlay {
// 	width: 100%;
// 	height: 100%;
// 	background-color: rgba(0, 0, 0, 0.3);
// 	border-radius: 15rpx;
// 	position: absolute;
// 	top: 0;
// 	left: 0;
// 	z-index: 9;
// }
.cont {
	padding-bottom: 50rpx !important;
	padding: 20rpx;
}
.top_cont {
	width: 60rpx;
	z-index: 15;
	.check {
		transform: scale(0.7);
	}
}

.product_btn {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	display: flex;

	text {
		width: 50%;
		background-color: $color14;
		color: $color2;
		text-align: center;
		padding: 10rpx 0;
		font-size: 28rpx;
		font-weight: bold;
	}

	text:first-child {
		border-right: 1px solid $color5;
		box-sizing: border-box;
		border-bottom-left-radius: 15rpx;
	}

	text:last-child {
		border-bottom-right-radius: 15rpx;
	}
	.text_btn {
		background-color: $color14;
		color: $color2;
	}
}
</style>
